<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .Echarts_box {
            width: 1000px;
            height: 500px;
        }
    </style>
    <script src="../lib/echarts.js"></script>
</head>

<body>
    <div class="Echarts_box">
    </div>
    <script>
        var myEcharts = echarts.init(document.querySelector('.Echarts_box'))
        var option = {
            title: {
                text: '安徽智慧教育',
                subtext: '研发部效能度量',
                link: 'https://e.gitee.com/wisdom-education_1/members',
            },
            tooltip: {
                triggerOn: 'click',
                axisPointer: {
                    type: 'cross'
                },
                position: function (pos, params, el, elRect, size) {
                    var obj = { top: 10 };
                    obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 30;
                    return obj;
                },
                formatter: function (params) {
                    console.log(params);
                    return params.name + '的' + params.seriesName + '是:<br/>' + params.value
                }
            },
            toolbox: {
                show: true,
                feature: {
                    saveAsImage: {},
                    restore: {},
                    dataView: {},
                    dataZoom: {},
                    magicType: {
                        show: true,
                        type: ['line', 'bar'],
                        title: {
                            line: '切换为折线图',
                            bar: '切换为柱状图',
                            
                        }
                    }
                }
            },
            legend: {
                data: ['代码行数', '分数']
            },
            xAxis: {
                type: 'category',
                data: ['范金帅', '侯远方', '胡加政', '李想', '王美华', '叶健', '袁旺', '张康康', '章涛', '朱梦虎']
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: '代码行数',
                    type: 'bar',
                    data: [118, 488, 160, 10, 333, 708, 100, 1028, 344, 558],
                    label: {
                        show: true,
                        position: 'inside',
                        rotate: 20,
                    },
                    markPoint: {
                        data: [
                            {
                                name: '最大值',
                                type: 'max'
                            },
                            {
                                name: '最小值',
                                type: 'min'
                            },
                        ]
                    },
                    markLine: {
                        data: [
                            {
                                name: '平均线',
                                type: 'average'
                            }
                        ]
                    },
                    // barWidth: 40
                },
                {
                    name: '分数',
                    type: 'bar',
                    data: [78, 48, 16, 60, 98, 70, 100, 82, 44, 58],
                    label: {
                        show: true,
                        position: 'inside',
                        rotate: 20,
                    },
                    markPoint: {
                        data: [
                            {
                                name: '最大值',
                                type: 'max'
                            },
                            {
                                name: '最小值',
                                type: 'min'
                            },
                        ]
                    },
                    markLine: {
                        data: [
                            {
                                name: '平均线',
                                type: 'average'
                            }
                        ]
                    },
                    // barWidth: 40
                }
            ]
        }
        myEcharts.setOption(option)
    </script>
</body>

</html>